import React, { useEffect, useState } from 'react';
import { withRouter, useParams, Link, useHistory } from 'react-router-dom'
import { getHomeList } from '@/api';
import { fmtDate } from '@/utils/filter.js'
import { List, Avatar, Card } from 'antd';
const ListDom = () => {
    const limit = 20;
    const history = useHistory();
    let { type, page = 1 } = useParams()
    const [homeList, setHomeList] = useState([])
    useEffect(() => {
        getArr({ type, limit, page })
    }, [type, page])
    return (
        <Card>
            <List
                dataSource={homeList}
                position='top'
                pagination={{
                    onChange: page => {
                        console.log(page);
                        history.push(`/home/${type}/${page}`);
                    },
                    pageSize: limit,
                    total: 500,
                    current: page - 0,
                    responsive: true
                }}
                renderItem={item => (
                    <List.Item>
                        <List.Item.Meta
                            avatar={<Link to={{ pathname: '/user/' + item.author.loginname }}><Avatar src={item.author.avatar_url} /></Link>}
                            title={<Link to={{ pathname: '/detail/' + item.id }}> {item.title}</Link>}
                            description={fmtDate(item.last_reply_at, 'yyyy-MM-DD hh:mm:ss')}
                        />
                    </List.Item>
                )}
            />
        </Card>
    );
    function getArr({ type, limit, page }) {//获取数据
        getHomeList({ tab: type, limit, page }).then((res) => {
            setHomeList(res.data)
        })
    }
}
export default withRouter(ListDom);